<template>
  <div class="app">
    <!-- 导航面包屑 -->
    <el-card>
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item>营销</el-breadcrumb-item>
        <el-breadcrumb-item :to="{path:'/home/withAGift'}">满赠</el-breadcrumb-item>
        <el-breadcrumb-item>新建{{this.$store.state.marketing.addType}}</el-breadcrumb-item>
      </el-breadcrumb>
      <h1>新建{{this.$store.state.marketing.addType}}</h1>
    </el-card>

    <!-- 基础信息 -->
    <el-card>
      <el-row>
        <el-col :span="7">
          <p>基础信息</p>
        </el-col>
        <el-col :span="14">
          <el-form ref="addWithAGiftForm" :model="addWithAGiftForm" label-width="80px">
            <!-- 占位 -->
            <el-form-item></el-form-item>
            <el-form-item></el-form-item>
            <!-- 活动名称 -->
            <el-form-item label="活动名称">
              <el-input style="width:350px" v-model="addWithAGiftForm.name" placeholder="请输入名称"></el-input>
            </el-form-item>
            <!-- 活动日期 -->
            <el-form-item label="活动日期">
              <el-date-picker
                v-model="addWithAGiftForm.validity"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                value-format="yyyy-MM-dd"
              ></el-date-picker>
            </el-form-item>
            <!-- 活动内容 -->
            <el-form-item label="活动内容">
              <el-input
                type="textarea"
                :rows="4"
                style="width:350px"
                v-model="addWithAGiftForm.content"
                placeholder="请输入名称"
              ></el-input>
            </el-form-item>
            <!-- 优惠叠加 -->
            <el-form-item label="优惠叠加">
              <el-radio-group v-model="addWithAGiftForm.superposition">
                <el-radio label="不可叠加"></el-radio>
                <el-radio label="可叠加其他类型优惠"></el-radio>
              </el-radio-group>
            </el-form-item>
            <!-- 商品限购 -->
            <el-form-item label="适用商品">
              <el-radio-group v-model="addWithAGiftForm.goods">
                <el-radio label="全部商品"></el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item>
              <el-radio-group v-model="addWithAGiftForm.goods">
                <el-radio label="部分商品"></el-radio>
              </el-radio-group>
            </el-form-item>
          </el-form>
        </el-col>
        <el-col :span="3"></el-col>
      </el-row>

      <!-- 提交和返回按钮 -->
      <el-button style="margin:30px 0 10px 410px" type="primary" @click="actionPackageMail">提交</el-button>
      <el-button @click="toWithAGift">返回</el-button>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      addWithAGiftForm: {
        name: "",
        validity: [],
        superposition: "",
        goods: "",
        content: "",
      },
      id: "",
    };
  },
  methods: {
    //点击跳转添加页面
    toWithAGift() {
      this.$router.push("/home/withAGift");
    },
    //添加满赠
    async addWithAGift() {
      const { data: res } = await this.$axios.post("/vip/fullGift/add", {
        name: this.addWithAGiftForm.name,
        type: this.$store.state.marketing.addType,
        status: "1",
        validity: this.addWithAGiftForm.validity[1],
        superposition: this.addWithAGiftForm.superposition,
        goods: this.addWithAGiftForm.goods,
        content: this.addWithAGiftForm.content,
      });
      if (res.code != 0) return this.$message.error("秒杀添加失败!");
      this.$message.success("秒杀添加成功!");
      this.toWithAGift();
    },
    //添加or修改
    actionPackageMail() {
      if (this.$store.state.marketing.action == "编辑")
        return this.editWithAGift();
      this.addWithAGift();
    },
    //修改满赠
    async editWithAGift() {
      const { data: res } = await this.$axios.post("/vip/fullGift/update", {
        name: this.addWithAGiftForm.name,
        type: this.$store.state.marketing.addType,
        status: "1",
        validity: this.addWithAGiftForm.validity[1],
        superposition: this.addWithAGiftForm.superposition,
        goods: this.addWithAGiftForm.goods,
        content: this.addWithAGiftForm.content,
        id: this.id,
      });
      if (res.code != 0) return this.$message.error("秒杀添加失败!");
      this.$message.success("秒杀添加成功!");
      this.toWithAGift();
    },
  },
  mounted() {
    if (!this.$store.state.marketing.action) return this.toWithAGift();
    //渲染修改信息
    if (this.$store.state.marketing.action == "编辑") {
      const info = this.$store.state.marketing.editInfo;
      console.log(info);
      this.addWithAGiftForm.name = info.name;
      this.addWithAGiftForm.validity = ["2021-08-01", info.validity];
      this.addWithAGiftForm.content = info.content;
      this.addWithAGiftForm.goods = info.goods;
      this.addWithAGiftForm.superposition = info.superposition;
      this.id = info.id;
    }
  },
};
</script>

<style>
</style>